import React, { useMemo } from 'react';
import { useCounter } from '@/hooks/useCounter';
import { Link } from 'react-router-dom';
import Styles from './index.module.scss';

const BaseURL = process.env.NODE_ENV === 'production' ? '/providen-craft-website/' : '/';

const Main = () => {
  const { count, increment } = useCounter();

  const env: 'development' | 'production' = useMemo(() => {
    return import.meta.env.VITE_TEST || process.env.NODE_ENV === 'test' ? 'development' : 'production';
  }, []);

  return (
    <>
      <h2 className={`test ${Styles.main}`}>Hello Vite + React!</h2>
      <p className="env">{env}</p>
      <Link
        to={BaseURL + 'preview'}
        style={{ display: 'block', color: 'blue', textDecoration: 'underline', fontSize: '5rem' }}
      >
        点击进入预览
      </Link>
      <Link
        to={BaseURL + 'preview/simulation'}
        style={{ display: 'block', color: 'blue', textDecoration: 'underline', fontSize: '5rem' }}
      >
        点击进入大场景预览
      </Link>
    </>
  );
};

export default Main;
